<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>事件的触发</title>
</head>
<body>
<input type="text" name="chana" value="用户名" id="box">
<script>
    function foo() {
        if (document.getElementById('box').value == '用户名') {
            document.getElementById('box').value = ''
        }
    }
    function foo1() {
        if (document.getElementById('box').value == '') {
            document.getElementById('box').value = '用户名'
        }
    }
    document.getElementById('box').onfocus = foo;
    document.getElementById('box').onblur = foo1;

</script>

</body>
</html>
onfocus  聚焦事件；得到焦点
onblur 失去焦点事件；元素失去焦点时
